<%@ page language="java" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="njtc" uri="http://www.njtcedu.cn/app/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/static/website/css/guest.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/static/website/css/main.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/static/website/css/theme.css">
	<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/static/website/css/style.css">

<script type="text/javascript"
	src="${pageContext.request.contextPath}/static/website/js/min.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/static/website/js/common.js"></script>
<script type="text/javascript"
	src="${pageContext.request.contextPath}/static/website/js/kinslideshow.js"></script>
	
<script type="text/javascript" src="${pageContext.request.contextPath}/static/website/js/home.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/website/js/weiboscroll.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/website/js/jquery.pause.min.js"></script>
	
<style type="text/css">
.topicTxt {
	margin: 0;
}

.feedCell .from {
	padding: 0;
}

.option {
	width: 10px;
	display: none;
	overflow: hidden;
}
.messagewrap{overflow:hidden;position:relative;width:700px;height:300px}
li{height:50px;}
.bottomcover{width:700px;height:45px;position:absolute;bottom:0;left:0;
pointer-events:none;background:url(halftransp.png) left bottom no-repeat;
</style>
</head>

<body>
	<div id="headWrap">
		<h1 id="logo">
			<a title="microblog" href="#"><img src="${pageContext.request.contextPath}/static/website/images/logo_guest.png"
				style="_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop)">
			</a>
		</h1>
	</div>
	<div id="mainWrapper">
		<div id="topbox">
			<div id="tleft">

				<div id="KinSlideshow" style="visibility: visible; width: 680px; height: 220px; overflow: hidden; position: relative;">
					<div id="KinSlideshow_moveBox" style="width: 680px; height: 220px; overflow: hidden; position: relative;">
						<div id="KinSlideshow_content">
							<a href="#" target="_blank">
								<img src="${pageContext.request.contextPath}/${images[0].imageUrl}" width="680px" height="220px" style="border: 0px;">
							</a> 
							<a href="#" target="_blank">
								<img src="${pageContext.request.contextPath}/${images[1].imageUrl}" width="680px" height="220px" style="border: 0px;">
							</a>
						</div>
						<div id="KinSlideshow_contentClone">
							<a href="#" target="_blank">
								<img src="${pageContext.request.contextPath}/${images[0].imageUrl}" width="680px" height="220px" style="border: 0px;">
							</a> 
							<a href="#" target="_blank">
								<img src="${pageContext.request.contextPath}/${images[1].imageUrl}" width="680px" height="220px" style="border: 0px;">
							</a>
						</div>
					</div>
					
					<div class="KinSlideshow_titleBar" style="height: 30px; width: 1%; position: absolute; bottom: 0px; left: 0px;"></div>
				</div>

				<!-- hot topic -->
				<div class="talking">
					<strong>正在热议：</strong>
					<div id="Tacticle" class="acticle">
						<div id="indemo">
							<c:forEach var="contentMessage" items="${ contentsResponse}" varStatus="status">
								<li>
									<div id="Tacticle_s">
										${contentMessage.topic }
									</div>
								</li>
							</c:forEach>
							<div id="demo2">asdasasd</div>
						</div>

					</div>
				</div>

			</div>

			<!-- register and login -->
			
			<div class="loginbox" id="loginbox_change">
				<a title="注册microblog" onclick="window.location.href='${pageContext.request.contextPath}/register';return false;" class="btn_reg">注册microblog</a>
				<div class="login_area">
					<form method="post"
						action="${pageContext.request.contextPath}/login" id="lgin_form">
						<div class="item">
							<span class="enterInput"> 用户名:<input type="text"
								name="account" class="inputtextTag" id="username" /> </span>
							<div id="username_tip"></div>
						</div>
						<div class="item">
							<span class="enterInput"> 密码:<input type="password"
								name="password" class="inputtextTag" id="password" /> </span>
							<div class="msgBox">
								<div id="login_tip" clsss="msgBoxFaild"></div>
							</div>
						</div>
						<div class="item"></div>
						<div class="clearfix">
							<span class="enterInput"> <input type="button"
								class="btn_login" id="login_submit"> </span>
						</div>
					</form>
				</div>
			</div>
		</div>

		<div id="midBox">
			<div class="mleft">
				<h1 class="htitle2">最受关注用户</h1>
				<ul class="userlist"></ul>
				<h1 class="htitle4">近期活跃用户</h1>
				<ul class="userlist">
				<c:forEach items="${topusers }" var="topUser">
					<li><a href="#">${topUser.nickName }</a></li>
				</c:forEach>
				</ul>
			</div>
			<div class="mcenter">
				<h1 class="htitle">大家都在说</h1>
				<!-- 消息列表 -->
				<div id="con">
			        <div class="bottomcover" style="z-index: 2;"></div>
			        <ul>
						<c:if test="${not empty contentsResponse}">
							<c:forEach var="contentMessage" items="${ contentsResponse}" varStatus="status">
							<li>
											<div class="div_left">
												<a href="#">
													<img src="${pageContext.request.contextPath}/${contentMessage.userImage }" width="100px">
												</a>
											</div>
											
											<div class="div_right">
												<a href="#">${ contentMessage.userName}</a>: &middot;
												<a href="#">#${contentMessage.topic }#</a>${contentMessage.content }
												<div class="twit_item_time"><fmt:formatDate value="${contentMessage.sendDate }" type="date" dateStyle="long"/></div>
											</div>
									</li>
							</c:forEach>
						</c:if>
					</ul>
				</div>
				
				</div>
			<div class="mright">
				<div class="dlblank">
					<h1 class="htitle3">公告</h1>
					<p></p>
				</div>
			</div>

		</div>
		<!-- 外链信息 -->
		<div class="mlink"></div>
	</div>
	<div style="clear:both;text-align:center;margin:5px auto;">Powered
		by Njtcedu</div>
</body>
</html>

<script>
	//用户登录
$('#lgin_form').find('#login_submit').click(
	function() {
		if ($('#username').val() == ""
				|| $('#password').val() == "") {
			$('#login_tip').html('请输入正确的用户名和密码');
			return;
	}

	var url = '${pageContext.request.contextPath}/login/?account='
		+ $('#username').val()
		+ '&password='
		+ $('#password').val();
		$.get(url, function(data) {
			if (data != "true") {
				alert(data);
			} else {
				location.href = '${pageContext.request.contextPath}/user/index';
		}
	});
});

$(function(){
	var  currentUser = ${ not empty currentUser};
	if (currentUser) {
		var html =  "<br><p><a href='${pageContext.request.contextPath}/user/index' style='font-size: 24px;color: green;'>进入microblog</a></p>";
		$('#loginbox_change').html( html );
	}
	
})
</script>
